<%--
  Created by IntelliJ IDEA.
  User: 全谢民
  Date: 2023/10/1
  Time: 8:39
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="path" value="${pageContext.request.contextPath }"/>
<html>
<head>
    <title>我的订单</title>
    <%--    左侧样式--%>
    <link rel="stylesheet" type="text/css" href="../css/user_page_css/user.css">
    <%--    头部底部样式--%>
    <link rel="stylesheet" type="text/css" href="../css/user_page_css/home_page.css">
    <%--    右侧样式--%>
    <link rel="stylesheet" type="text/css" href="../css/user_page_css/userOrderDetail.css">
    <%--    导入js--%>
    <script rel="script" type="text/javascript" src="../js/jquery-3.6.4.js"></script>
</head>
<body>
<%--    前端用户--%>
<%@include file="header.jsp"%>
<div class="content">
    <div class="main">
        <div class="user-profile-nav">
            <h1>个人中心</h1>
            <a class="userBack" style="background-color: #ef4238" onclick="jquery:window.location='userOrderDetail.jsp'">我的订单</a>
            <a class="userBack" onclick="jquery:window.location='userCollection.jsp'">我的收藏</a>
            <a class="userBack" onclick="jquery:window.location='userComments.jsp'">我的评论</a>

            <%--            收获地址--%>
            <a class="userBack" onclick="jquery:window.location='userShoppingAddress.jsp'">收货地址</a>
            <a class="userBack" onclick="jquery:window.location='userProfile.jsp'">基本信息</a>
            <a class="userBack" onclick="jquery:window.location='userSetUp.jsp'">账号设置</a>
            <%--            登陆方式 /1.手机号验证2.密码 3.邮箱 4.实名认证--%>
            <a class="userBack" onclick="jquery:window.location='userTicketPeople.jsp'">常用购票人</a>
            <%--            姓名/证件类型/身份证号--%>
            <a class="userBack" onclick="jQuery:window.location=''">退出登录</a>
        </div>
        <div class="orders-container">
            <div class="profile-title">
                我的订单
            </div>
            <div class="order-box">
                <c:set var="user_id" value="${sessionScope.user.user_id}"/>
                <c:choose>
                    <c:when test="${empty ordersList}">
                        <%--<script>
                            window.location='${path}/OrderUserServlet?prom=orderUser&id=${user_id}';
                        </script>--%>
                    </c:when>
                    <%--<c:when test="${empty ordersList}">
                        <h1>暂无订单</h1>
                    </c:when>--%>
                    <c:otherwise>
                        <c:forEach var="ol" items="${ordersList}">
                            <div id="${ol.orders_id}">
                                <div class="order-header">
                                    <span class="order-date">${ol.orders_time}</span>
                                    <span class="order-id">猫眼订单号：2416203867${ol.orders_id}</span>
                                    <span class="del-order" onclick="delOrder(${ol.orders_id})"></span>
                                </div>
                                <div class="order-body">
                                    <div class="poster"><img src="${path}/images/moviePicture/${ol.movie_picture}"></div>
                                    <div class="order-content">
                                        <div class="movie-name">《${ol.movie_cn_name}》</div>
                                        <div class="cinema-name">${ol.cinema_name}</div>
                                        <div class="hall-ticket">${ol.seat}</div>
                                        <div class="show-time">${ol.orders_time}</div>
                                    </div>
                                    <div class="order-price">￥${ol.orders_price}</div>
                                    <div class="order-status">
                                        <c:if test="${ol.orders_status==1}">
                                            已完成
                                        </c:if>
                                        <c:if test="${ol.orders_status==2}">
                                            已取消
                                        </c:if>
                                        <c:if test="${ol.orders_status==3}">
                                            待支付
                                        </c:if>
                                        <c:if test="${ol.orders_status==4}">
                                            待取票
                                        </c:if>
                                    </div>
                                    <div class="actions">
                                        <div>
                                            <a class="order-detail" onclick="detail(${ol.orders_id})">查看详情</a>
                                        </div>
                                    </div>
                                </div >
                            </div>
                        </c:forEach>
                    </c:otherwise>
                </c:choose>
                <c:set var="pages" value="${sessionScope.page}"/>
                <div style="text-align: center;width: 878px;">
                    <p style="display: inline-block">当前页数：[${pages.currPageNo}/${pages.totalPageCount}]
                        <c:if test="${pages.currPageNo>1}">
                    <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=1&id=${user_id}">
                        <input type="submit" value="首页" class="n1">
                    </form>
                    <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=${pages.currPageNo-1}&id=${user_id}">
                        <input type="submit" value="上一页" class="n1" >
                    </form>
                    </c:if>
                    <c:if test="${pages.currPageNo<pages.totalPageCount}">
                        <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=${pages.currPageNo+1}&id=${user_id}">
                            <input type="submit" value="下一页" class="n1">
                        </form>
                        <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=${pages.totalPageCount}&id=${user_id}">
                            <input type="submit" value="末页" class="n1">
                        </form>
                    </c:if>
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>
<%@include file="footer.jsp"%>
<script>
    function delOrder(orderId) {
        var str=confirm("您确定要删除该订单嘛？删除后，不可恢复～");
        if (str){
            $.post("${path}/OrderUserServlet?prom=userDelOrder","&id="+orderId,function (result) {
                if (result>0){
                    alert("删除成功！");
                    $("#"+orderId).remove();
                }else {
                    alert("删除失败")
                }
            },"text");
        }
    }
    function detail(orderId) {
        window.location='${path}/OrderUserServlet?prom=orderDetail&id='+orderId;
    }
</script>
</body>
</html>
